如何解决前后端分离跨域问题

55次阅读
没有评论

共计 498 个字符,预计需要花费 2 分钟才能阅读完成。

跨域问题

CORS(Cross-Origin Resource Sharing,跨源资源共享),也叫跨域资源共享,是一种基于 HTTP 头的机制,该机制通过允许服务器标示除了它自己以外的其他源(域、协议或端口),使得浏览器允许这些源访问加载自己的资源。

出现跨域问题的主要原因是同源策略的限制。同源策略是浏览器的一种安全策略,是浏览器的行为,而且只针对 fetch、xhr 请求。只要协议、主机、端口之一不一致,就不同源。

响应头解决

要实现 CORS 很简单,只需在服务端添加响应头:Access-Control-Allow-Origin: *

代理解决

前端服务器若是用 express 的话,只需安装一个插件:npm i http-proxy-middleware --save-dev,然后在 express 服务器启动代码中加入:

import {createProxyMiddleware} from 'http-proxy-middleware'

// ...

app.use('/api', createProxyMiddleware({ target: 'http://localhost:8080', changeOrigin: true}))

正文完
 0
三毛笔记
版权声明:本站原创文章,由 三毛笔记 于2023-12-07发表,共计498字。
转载说明:除特殊说明外本站文章皆由CC-4.0协议发布,转载请注明出处。
评论(没有评论)